SSR — Server Side Rendering 伺服器渲染

服務器端渲染 — 在服務器(Server)上將客戶端或通用應用程序渲染為 HTML。

SPA —single-page application 單頁應用

SPA導致SEO（搜尋引擎最佳化）變差，會先渲染網頁內容，
後續的操作會交給 JavaScript， 雖然使用者一樣能夠享受SPA帶來的爽度！不用換頁的好處
不過在第一次的載入中，會較慢，在開發的時候也需要搭配後端技術，來解除這個缺點！

利用AJAX 非同步的特性跟後端同步資料，
將不同的資料動態輸向同一個頁面，達到網頁操作不換頁，
來與使用者互動，而非傳統從伺服器重新載入新頁面，

這時候你肯定會問！為什麼要用這種方式呢？來！聽我娓娓道來…

這種方法是為了避免頁面之間的切換打斷使用者的體驗，
著手使用起來更像一個桌面應用程式。

在單頁應用中，除了第一次是全頁下載，之後都是部分更新！！！
（你沒看錯，就是如此機靈！！不過，因為第一次看SPA網站的時候，
下載的東西會比較多，所以速度會比較慢，但後面幾次互動都會很快，因為請求的資料變少了！
所有的code（HTML、JavaScript和CSS）都會通過單個的頁面載入，
或回應使用者操作時將動態裝載適當的資源且加入到頁面裡！
頁面在過程中的任何時間都不會重新載入，也不會將控制轉移至其他頁面上，
都會在這頁面解決。

舉個例子，大家應該都用過gmail吧!!!!
相信在收發現間過程中，都能感受到使用上的順暢，
是的，就是通到大腸的那個順暢感 ! 順拉！（碰杯！！！
當你在撰寫信件，或者收信時，都不會感受到畫面的跳動，
就是那不注意的一小下！那令眼睛毀花的一小下，真的粉北送！！
而沒有那一小下，就是所謂單頁應用的特色！
當你在頁面按另一封郵件的時候，SPA網頁只會換掉郵件內容，
並把這封郵件變為已讀的icon，網頁中其他的東西都沒有動過，
這有傳輸資料就很少，因為他不是整頁換掉，速度就會快很多，用起來就是爽！

BUT ，沒錯！就是那個把特！
如果將SPA這個做法用到部落格，就會出現問題囉！
還記得上面提到的，他第一次下載是一個沒有實際內容的框架，
這個就會被爬蟲讀取，所以…對網站的搜尋器來講，
這一頁的網頁就是一個框架的空殼，
爬蟲也不一定會等Javascript抓回實際內容過程，
也就是說你的網頁在搜尋結果上是沒有辦法出現，
自然你的搜尋流量就打水漂拉～就算真的有讀取，
也不能保證能100%讀取，
對SEO（搜尋引擎最佳化）非常不友好啊～

所以該選擇什麼呢？小朋友才做選擇拉（拍肩）

SPA的優點：

• 速度快
• 能夠離線使用

SPA的缺點：

使用者操作太快，前端就不能保證每次都能得到正確的 Server 資料
（例子：點進商品 A → 快速按上一頁 → 快速點進商品B → 畫面顯示商品 A 資料）

• 內容由 JavaScript 動態產生，瀏覽器載入並且執行 JavaScript、等 Response 回傳後才會看到畫面，因此SEO表現較差。

程式新手，我是麻瓜，每天一點一滴學習，雖然跑不快！
但認真！感謝您的收看！
明天見～嘻

參考資料：維基百科